﻿<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0, maximum-scale=1, minimum-scale=1">
    <title>TestLogin</title>
    <script src="https://code.jquery.com/jquery-3.3.1.min.js"
            integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
            crossorigin="anonymous"></script>
    <link href="/dist/vendor.dll.css" rel="stylesheet">
</head>
<body>
<div class="card">
    
    User:
    - IsAuthenticated {{ userSession | select: { it.IsAuthenticated } }}
    - UserName {{ userSession | select: { it.UserName } }}
    - LastName {{ userSession | select: { it.LastName } }}
    - Is Admin {{ userHasRole('Admin') }}
    - Has Permission {{ userHasPermission('ThePermission') }}
</div>
    <form id="login-form" action="/auth/login" method="POST" style="text-align: center; padding: 0 0 300px 0" _lpchecked="1">
        <div style="font-size: 16px; width: 400px; text-align: left; display: inline-block;">
            <p class="error-summary alert alert-danger"></p>
            <div class="form-group"> <label for="email">Email Address</label> <input class="form-control input-lg" type="text" name="UserName" value="" style="background-image: url(&quot;&quot;); cursor: auto;"> </div>
            <div class="form-group"> <label for="password">Password</label> <input class="form-control input-lg" type="password" name="Password" value="" placeholder="" style="background-image: url(&quot;&quot;); cursor: auto;"> </div>
            <div class="form-group" style="text-align: center; padding: 20px 0 0 0">
                <button class="btn btn-grove-one btn-xlg btn-bold" style="width: 200px" type="submit">Sign In</button>
                <p> <a class="forgot-password" href="/forgot-password">forgot password?</a> </p>
            </div>

            <a className="nav-link" href="/auth/logout?continue=/">Logout</a>
        </div>
        <div class="clearfix"></div>
    </form>

    <div id="footer" style="text-align:center; position:absolute; bottom:50px; width:100%;">
        <h4>
            <img src="/dist/img/logo.png" />
            <a href="https://servicestack.net/vs-templates/ReactApp">Learn about this React VS.NET template</a>
        </h4>
        <div>Copyright &copy; {{ now | dateFormat('yyyy') }}</div>
    </div>
    <script src="/js/ss-utils.js"></script>
    <script>
$("#login-form").bindForm({
        success: function(r) {
            location.href = '/';
        },
        error: function(data) {
            console.log(data);
        },
    });</script>
    <script type="text/javascript" src="/dist/vendor.dll.js"></script>
    <script type="text/javascript" src="/dist/app.bundle.js"></script>
</body>
</html>
